<script setup lang="ts">
import { inject } from 'vue';
import HmButton from './HmButton.vue';
import SonSonCom from './SonSonCom.vue';

 interface Person {
  name: string;
  age: number;
}
defineProps<Person>()
// 子传父3.3之后版本写法
// const emit=defineEmits<{
//   (e:'my-event',age:number):void
// }>()
//3.3 版本和之前版本
const emits=defineEmits<{
  'my-event':[age:number]
  'my-name':[name:string]
}>()
const totalCount=inject('totalCount')
</script>

<template>
<div class="son">
    <h2>我是子组件</h2>
    <p>{{ name }}</p>
    <p>{{ age }}</p>
    <p>{{ totalCount }}</p>
<button @click="emits('my-event',age)">点击触发</button>
<button @click="emits('my-name',name)" >得到名字</button>
<SonSonCom></SonSonCom>
  </div>
</template>
<style scoped>
.son{
  border: 3px solid pink;
  margin: 10px;
}
</style>